<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>考试学员管理</title>
</head>
<body>

	<div class="easyui-layout" data-options="fit:true,border:false">
		<div data-options="region:'west',split:true,hideCollapsedContent:false,title:'专业类别'" style="width:240px;">
			<ul id="sblb20200530"></ul>
		</div>
		<div data-options="region:'center',border:true">
			<div id="toolbar20210220" style="padding: 4px;">
				<form>
					<a href="javascript:" class="easyui-linkbutton" iconCls="icon-add" plain="true">添加</a>
					<a href="javascript:" class="easyui-linkbutton" iconCls="icon-no" plain="true">删除</a>
					<a href="javascript:" class="easyui-linkbutton" iconCls="icon-edit" plain="true">修改</a>
					<a href="javascript:" class="easyui-linkbutton"  plain="true">Excel导入</a>
					<a href="javascript:" class="easyui-linkbutton"  plain="true">Excel模版下载</a>
					<input class="easyui-searchbox" data-options="prompt:'请输入查找内容',menu:'#mm-searchbox-2021-6-5'" style="width: 220px;" >
					<input class="easyui-radiobutton" id="sbczzt3" name="sbczzt" value="3" data-options="label:'全部',labelPosition:'after',checked: true">
					<input class="easyui-radiobutton" id="sbczzt2" name="sbczzt" value="2" data-options="label:'大于等于60',labelPosition:'after'">
					<input class="easyui-radiobutton" id="sbczzt1" name="sbczzt" value="1" data-options="label:'小于60',labelPosition:'after'">
				</form>
			</div>
			<table id="menu_edit_20181029"></table>
		</div>
	</div>
	<div id="mm-searchbox-2021-6-5">
		<div data-options="name:'all'">姓名</div>
		<div data-options="name:'sports'">学号</div>
	</div>
	<script>
		//处理点击radiobutton处理的事件
		$(function () {
			$('#sbczzt3').radiobutton({
				onChange: function (checked) {
					situationFun(3,checked)
				}
			});
			$('#sbczzt2').radiobutton({
				onChange: function (checked) {
					situationFun(2,checked)
				}
			});
			$('#sbczzt1').radiobutton({
				onChange: function (checked) {
					situationFun(1,checked)
				}
			});
		});

		function situationFun(situation,checked) {
			if(!checked) return;
			$('#menu_edit_20181029').datagrid('load',{
				situation: situation
			});
		}

	</script>


	<div id="mm_20181030" class="easyui-menu" style="width:120px;display: none;">
	    <div data-options="iconCls:'icon-add',id:'m-addF-201900722'">新增</div>
	    <div data-options="iconCls:'icon-edit',id:'m-update-20190722'">修改</div>
		<div data-options="id:'m-delete-20190722'">删除</div>
	</div>

<!--	<div id="dialog_20190723_addOrUpdateOrMenu" style="padding:10px 30px;display: none;">-->
<!--		<div style="height: 60px;">-->
<!--			<div style="float: left;width: 49%;">-->
<!--				<form id="uploadImage20200602form" method="post" data-options="novalidate:true" enctype="multipart/form-data">-->
<!--					<input class="easyui-filebox" id="fileBox20200602" name="files" style="width:80%;" data-options="buttonText:'选择图片',multiple:true,accept: 'image/*'" >-->

<!--					<div style="height: 10px;"></div>-->
<!--					<a href="javascript:" id="uploadImage20200602Button" class="easyui-linkbutton" style="width: 100px;" onclick="uploadImage20200602()">上传</a>-->
<!--				</form>-->
<!--			</div>-->
<!--			<div style="float: left; width: 49%;height: 120%;border-left: 1px #5f5f5f dashed; padding-left: 10px;" id="devicePicture"></div>-->
<!--		</div>-->
<!--		<br/>-->
<!--		<hr style="margin-bottom:20px"/>-->
<!--		<form id="from20190723" method="post" data-options="novalidate:true">-->
<!--			<div style="margin-bottom:20px">-->
<!--				<input class="easyui-textbox" id="updateID20200531" name="id" style="width:49%;" >-->
<!--				<input class="easyui-textbox" name="name" style="width:49%" data-options="label:'设备名称:',required:true">-->
<!--				<input id="sblb-zd-20200530" class="easyui-combotree" name="categoryId" data-options="label:'设备类别:',required:true" style="width:49%">-->
<!--			</div>-->
<!--			<div style="margin-bottom:20px">-->
<!--				<input class="easyui-textbox" name="brands" style="width:49%" data-options="label:'设备品牌:',required:true">-->
<!--				<input class="easyui-textbox" name="type" style="width:49%" data-options="label:'设备型号:',required:true">-->
<!--			</div>-->
<!--			<div style="margin-bottom:20px">-->
<!--				<input class="easyui-textbox" name="tonnage" style="width:49%" data-options="label:'设备吨位:'">-->
<!--				<input class="easyui-textbox" name="once" style="width:49%" data-options="label:'价格-次:',required:true">-->
<!--			</div>-->
<!--			<div style="margin-bottom:20px">-->
<!--				<input class="easyui-textbox" name="month" style="width:49%" data-options="label:'价格-月:',required:true">-->
<!--				<input class="easyui-textbox" name="year" style="width:49%" data-options="label:'价格-年:',required:true">-->
<!--			</div>-->
<!--			<div style="margin-bottom:20px">-->
<!--				<input class="easyui-textbox" name="deposit" style="width:49%" data-options="label:'设备定金:',required:true">-->
<!--				<input class="easyui-textbox" name="price" style="width:49%" data-options="label:'设备价格:',required:true">-->
<!--			</div>-->
<!--			<div style="margin-bottom:20px">-->
<!--				<input class="easyui-textbox" name="contacts" style="width:49%" data-options="label:'联系人:',required:true">-->
<!--				<input class="easyui-textbox" name="contactsPhone" style="width:49%" data-options="label:'联系电话:',required:true">-->
<!--			</div>-->
<!--			<div style="margin-bottom:20px">-->
<!--				<input class="easyui-numberspinner" name="hot" value="50" style="width:25%" data-options="label:'热门度:',min:1,max:100,required:true">(数字小排名高)-->
<!--				&nbsp;&nbsp;-->
<!--&lt;!&ndash;				1.租赁 2.出售 3.既出租又出售&ndash;&gt;-->
<!--				<select class="easyui-combobox" name="situation" style="width:25%" data-options="label:'设备租售:',required:true,panelHeight:'auto'">-->
<!--					<option value="2" selected>出售</option>-->
<!--					<option value="1">租赁</option>-->
<!--					<option value="3">租赁/出售</option>-->
<!--				</select>-->
<!--				&nbsp;&nbsp;-->
<!--				<select class="easyui-combobox" name="state" style="width:25%" data-options="label:'发布状态:',required:true,panelHeight:'auto'">-->
<!--					<option value="1" selected>发布中</option>-->
<!--					<option value="0">下架</option>-->
<!--				</select>-->
<!--			</div>-->
<!--			<div style="margin-bottom:20px">-->
<!--				<textarea name="" id="detail" rows="20" cols="80">-->
<!--                    行业咨询详情描述-->
<!--                </textarea>-->
<!--			</div>-->
<!--		</form>-->
<!--	</div>-->
<!--	<div id="dialog_button_20190723" style="display: none;">-->
<!--		<a id="dialog_20190723_addOrUpdateOrMenu_close">放弃</a>-->
<!--		<a href="javascript:" class="easyui-linkbutton" onclick="menuMergeAdmin20200531()" data-options="iconCls:'icon-ok'">保存</a>-->
<!--	</div>-->

	<!-- 树结构的右击菜单 -->
	<div id="treeCRUD20200606" class="easyui-menu" style="width:120px;">
		<div data-options="iconCls:'icon-add',id:'tree-add0606lb'">添加类别</div>
		<div class="menu-sep"></div>
		<div data-options="id:'tree-add0606zjd'">添加子节点</div>
		<div data-options="id:'tree-add0606update'">修改</div>
		<div class="menu-sep"></div>
		<div data-options="iconCls:'icon-no',id:'tree-add0606delete'">删除</div>
	</div>

	<!--  树结构添加、修改的对话框	-->
	<div id="dialog_20200606_tree" style="padding:10px 30px;display: none;">
		<form id="tree_form20200607" method="post" data-options="novalidate:true" >
			<div style="margin-bottom:20px">
				<input class="easyui-textbox" id="title_tree" name="title" style="width:100%" data-options="label:'栏目名称:',required:true">
			</div>
		</form>
	</div>
	<div id="dialog_buttons_20200606" style="display: none;">
		<a href="javascript:$('#dialog_20200606_tree').dialog('close')" class="easyui-linkbutton">放弃</a>
		<a href="javascript:" class="easyui-linkbutton" data-options="iconCls:'icon-ok'" onclick="treeUpdataAndInsert20200607()">保存</a>
	</div>

	<script>
		// $(function () {
		// 	$('#dialog_20190723_addOrUpdateOrMenu_close').linkbutton({
		// 		onClick: function (none) {
		// 			$('#dialog_20190723_addOrUpdateOrMenu').dialog('close');
		// 		}
		// 	});
		// })

		function treeUpdataAndInsert20200607(){
			let title_tree = $('#tree_form20200607').form('validate');
			//判断验证是否通过
			if (!title_tree) return;

			//得到弹框上的标题-即可得到是添加什么或修改
			let dialogTitle = $('#dialog_20200606_tree').panel('options').title;

			//得到选中tree节点的信息
			let node = $('#sblb20200530').tree('getSelected');

			//得到文本框的内容
			let title_tree_value = $('#title_tree').textbox('getValue');

			let date = {};
			if(dialogTitle == '添加类别'){
				date = {parentId:0,state:1,text:title_tree_value};
			}else if(dialogTitle == '添加子节点'){
				date = {parentId:node.id,state:1,text:title_tree_value};
			}else if(dialogTitle == '修改'){
				date = {id:node.id,parentId:node.parentId,state:1,text:title_tree_value};
			}
			let url = './../category/mergeCategory';
			$.ajax({
				type: "POST",
				url: url,
				data: date,
				success: function(json){
					if(json.code == 200){
						new jBox('Notice', {
							color: 'green',
							autoClose: 2500,
							content: '保存成功。',
							showCountdown: true,
							animation: 'slide'
						});
						$.getJSON('./../category/getCategory',{state:1}, function(json){
							let data = json.rows;
							$('#sblb20200530').tree({
								data: data
							});
							$('#sblb-zd-20200530').combotree('loadData', data);
						});
						$('#dialog_20200606_tree').dialog('close');
					}else{
						new jBox('Notice', {
							color: 'red',
							autoClose: 2500,
							content: '保存失败！',
							showCountdown: true,
							animation: 'slide'
						});
					}
				}
			});
			console.log(title_tree)
		}

		$(function(){
			//tree鼠标右击菜单
			$('#treeCRUD20200606').menu({
				onClick:function(item){
					$('#title_tree').textbox('setValue','');
					let menuTitle = item.text;
					let node = $('#sblb20200530').tree('getSelected');

					if(item.id == 'tree-add0606delete'){	//删除
						$.messager.confirm('提示','确定要删除吗?删除后将不可恢复！',function(r){
							if (r){
								let ids = [node.id];
								$.ajax({
									type: "POST",
									url: "./../category/deleteCategory",
									data: {ids:ids},
									success: function(json){
										if(json.code == 200){
											new jBox('Notice', {
												color: 'green',
												autoClose: 2500,
												content: '删除成功。',
												showCountdown: true,
												animation: 'slide'
											});
											$('#sblb20200530').tree('remove', node.target);
										}else{
											new jBox('Notice', {
												color: 'red',
												autoClose: 2500,
												content: '删除失败！',
												showCountdown: true,
												animation: 'slide'
											});
										}
									}
								});
								//alert(node.id);
							}
						});
					}else {
						$('#dialog_20200606_tree').dialog('open').dialog('center').dialog('setTitle',menuTitle);
						if(item.id == 'tree-add0606lb'){  //添加子节点

						}else if(item.id == 'tree-add0606zjd'){ //添加子节点

						}else if(item.id == 'tree-add0606update'){ //修改
							$('#title_tree').textbox('setValue',node.text);
						}
					}
				}
			});

			$('#dialog_20200606_tree').dialog({
				width: 400,
				closed: true,
				modal: true,
				buttons:'#dialog_buttons_20200606'
			});
		});

		//把图片文件循环到修改对话框里
		function devicePicture(devicePicture){
			var htmlStr = '';
			for (var i=0;i<devicePicture.length;i++){
				var jsonObject = devicePicture[i];
				var name = jsonObject.fileName;
				var id = jsonObject.id
				htmlStr += '<img src="./../js/themes/icons/cancel.png" style="cursor: pointer;" onclick=deleteImages20200601('+id+') />&nbsp;'+name+'<br/>';
			}
			$('#devicePicture').html(htmlStr);
		}

		//图片删除
		function deleteImages20200601(id){
			let ids = [id];
			$.messager.confirm('提示','确定要删除吗?',function(r){
				if (r){
					deleteImage20200602(ids);
				}
			});

		}

		function fDetail0616() {
			let ckf = CKEDITOR.instances.detail.getData();
			return ckf;
		}

		function uploadImage20200602(id){
			let fileBox20200602 = $('#fileBox20200602').textbox('getValue');
			if(fileBox20200602.length <= 0){
				$.messager.alert('提示','请选择要上传的图片');
				return false;
			}

			let fileSize = $("#fileBox20200602").filebox("files")[0];
			if(fileSize.size > 2048000){
				$.messager.alert('提示','上传的图片不能大于2M！！');
				return false;
			}
			console.log(fileSize,123466666);

			let updateID20200531 = $('#updateID20200531').textbox('getValue');
			if (updateID20200531.length >= 1 ){
				id = updateID20200531;
			}
			$('#uploadImage20200602form').form('submit',{
				url:'./../device/uploadPicture',
				iframe: false,
				queryParams: {
					deviceId:id
				},
				onSubmit:function(param){

					return $(this).form('enableValidation').form('validate');
				},
				success:function(json){
					let data = eval('(' + json + ')');  // change the JSON string to javascript object
					if(data.code == 200){
						new jBox('Notice', {
							color: 'green',
							autoClose: 2500,
							content: '保存成功。',
							showCountdown: true,
							animation: 'slide'
						});
						reloadDatagrid();
					}else{
						new jBox('Notice', {
							color: 'red',
							autoClose: 2500,
							content: '保存失败！',
							showCountdown: true,
							animation: 'slide'
						});
					}
				}
			});
		}

		$(function () {
			CKEDITOR.replace( 'detail' );
			$('#updateID20200531').next().hide(); //隐藏修改时候的id
			$.getJSON('./../category/getCategory',{state:1}, function(json){
				let data = json.rows;
				$('#sblb20200530').tree({
					data: data
				});
				$('#sblb-zd-20200530').combotree('loadData', data);
			});

			//设备类别tree结构
			$('#sblb20200530').tree({
				onLoadSuccess: function (node, data) {
					//$(this).tree('collapseAll');
				},
				animate:true,
				formatter:function(node){
					var s = node.text;
					if (node.children){
						s += '&nbsp;<span style=\'color:blue\'>(' + node.children.length + ')</span>';
					}
					return s;
				},
				onClick: function(node){
					let treeIsLeaf = $(this).tree('isLeaf', node.target);
					if(treeIsLeaf){
						$('#menu_edit_20181029').datagrid('load',{
							categoryId: node.id
						});
						console.log(node);
					}
					//console.log(treeParent)
				},
				onContextMenu: function(e, node){
					e.preventDefault();
					// select the node
					$(this).tree('select', node.target);

					//判断是否是叶节点
					let treeIsLeaf = $(this).tree('isLeaf', node.target);
					let add0606zjd = $('#tree-add0606zjd')[0];
					//隐藏和显示菜单指定栏目
					if(treeIsLeaf){
						$('#treeCRUD20200606').menu('hideItem', add0606zjd);
					}else{
						$('#treeCRUD20200606').menu('showItem', add0606zjd);
					}

					//得到父节点
					let treeParent = $(this).tree('getParent', node.target);
					//if(treeIsLeaf){
						console.log(node,treeParent);
					//}

					// display context menu
					$('#treeCRUD20200606').menu('show', {
						left: e.pageX,
						top: e.pageY
					});
				}
			});

			// $('#dialog_20190723_addOrUpdateOrMenu').dialog({
			// 	width: '90%',
			// 	height: '90%',
			// 	closed: true,
			// 	modal: true,
			// 	buttons:'#dialog_button_20190723'
			// });
			//列表鼠标右击菜单
			$('#mm_20181030').menu({
				onClick:function(item){
					clearForm();
					let menuTitle = item.text;

					if(item.id == 'm-update-20190722'){
						let rowData = $('#menu_edit_20181029').datagrid('getSelected');
						loadLocal(rowData);
						CKEDITOR.instances.detail.setData(rowData.detail);
						devicePicture(rowData.devicePicture);
						$('#uploadImage20200602Button').show();
						$('#dialog_20190723_addOrUpdateOrMenu').dialog('open').dialog('center').dialog('setTitle',menuTitle);
					}
					if(item.id == 'm-addF-201900722'){
						CKEDITOR.instances.detail.setData('');
						$('#uploadImage20200602Button').hide();
						$('#dialog_20190723_addOrUpdateOrMenu').dialog('open').dialog('center').dialog('setTitle',menuTitle);
					}
					if(item.id == 'm-delete-20190722'){
						$.messager.confirm('提示','确定要下架吗?下架后小程序里将看不到该信息！',function(r){
							if (r){
								let rowData = $('#menu_edit_20181029').datagrid('getSelected');
								let ids = [rowData.id];
								deleteDatagrid(ids);
							}
						});
					}
				}
			});

		});

		function loadLocal(rowData){
			$('#from20190723').form('load',rowData);
		}

		function clearForm(){
			$('#devicePicture').html('');
			$('#from20190723').form('clear');
			$('#uploadImage20200602form').form('clear');

		}


		$('#menu_edit_20181029').datagrid({
			url: './../device/getDevicePage',
			method: 'get',
			border: false,
		    fit: true,
		    fitColumns: true,
			scrollbarSize: 2, //滚动条宽度
		    striped: true,
			rownumbers: true,
			pagination: true,
			singleSelect: true,
			sortName: 'updateTime',   //定义排序的列名
			sortOrder: 'desc',   //'asc' 或 'desc'。
			nowrap:false, //设置为 true，则把数据显示在一行里。设置为 true 可提高加载性能。
		    columns:[[
				{field:'idD',title:'id',width:80,hidden:true},
				{field:'updateTime',title:'年/级',width:80,hidden:true},
				{field:'categoryId',title:'专业',width:80,hidden:true},
				{field:'id',title:'学号',width:80},
				{field:'brands',title:'姓名',width:80},
				{field:'type',title:'成绩',width:80},
				{field:'tonnage',title:'考试次数',width:80,
					formatter: function(value,row,index){
						if (parseInt(value) > 1){
							return '<a href="javascript:" title="展示历史考试情况：' +
									'<br/>' +
									'1、2020-10-21：32分' +
									'<br/>' +
									'2、2020-12-22：88分' +
									'" class="note">' + value + '</a>';
						}else{
							return value;
						}
					}
				},
				{field:'contactsPhone',title:'联系电话',width:80,hidden:true},
				{field:'detail',title:'设备详情描述',width:80,hidden:true},
		       	{field:'state',title:'考试状态',width:80,
                    formatter: function(value,row,index){
                        if (value == 1){
                            return '<span class="easyui-dot easyui-status-processing"></span> 正常';
                        } else {
                            return '<span class="easyui-dot easyui-status-error"></span> 停靠';
                        }
                    },
					align:'left'
				},
				{field:'month',title:'备注',width:80}
		    ]],
			onRowContextMenu:function(e,index,row){
		    	e.preventDefault();
				$(this).datagrid('unselectAll');
				var addZ = $('#m-delete-20190722')[0];
				var update = $('#m-update-20190722')[0];
				if(!row){
					$('#mm_20181030').menu('hideItem', addZ).menu('hideItem', update);
				}else{
					$('#mm_20181030').menu('showItem', addZ).menu('showItem', update);
					$(this).datagrid('selectRow', index);
				}
				$('#mm_20181030').menu('show', {
					left:e.pageX,
					top:e.pageY
				});
		    },
			onHeaderContextMenu: function(e, field) {
				e.preventDefault();
				$(this).datagrid('columnMenu').menu('show', {
					left: e.pageX,
					top: e.pageY
				});
			},
		    onDblClickRow:function(index,row){
				$(this).datagrid('selectRow', index);
				loadLocal(row);
				devicePicture(row.devicePicture);
				$('#uploadImage20200602Button').show();
				CKEDITOR.instances.detail.setData(row.detail);
				$('#dialog_20190723_addOrUpdateOrMenu').dialog('open').dialog('center').dialog('setTitle','修改');
		    },
			onLoadSuccess:function(data){
				$(".note").tooltip({
					position: 'right',
					onShow: function(){
						$(this).tooltip('tip').css({
							width:'260',
							boxShadow: '1px 1px 3px #292929'
						});
					}
				});
			},
			toolbar:'#toolbar20210220'
		});

		// 保存和修改
		function menuMergeAdmin20200531() {
			let fileBox20200602 = $('#fileBox20200602').textbox('getValue');
			let dialogTitle = $('#dialog_20190723_addOrUpdateOrMenu').panel('options').title;
			if(dialogTitle == '修改'){
				$('#from20190723').form('submit',{
					url:'./../device/saveOrUpdateDevice',
					iframe: false,
					onSubmit:function(param){
						param.detail = fDetail0616();
						return $(this).form('enableValidation').form('validate');
					},
					success:function(json){
						let data = eval('(' + json + ')');  // change the JSON string to javascript object
						if(data.code == 200){
							new jBox('Notice', {
								color: 'green',
								autoClose: 2500,
								content: '保存成功。',
								showCountdown: true,
								animation: 'slide'
							});
							reloadDatagrid();
						}else{
							new jBox('Notice', {
								color: 'red',
								autoClose: 2500,
								content: '保存失败！',
								showCountdown: true,
								animation: 'slide'
							});
						}
					}
				});
			}else{
				if(fileBox20200602.length <= 0){
					$.messager.alert('提示','请选择要上传的图片');
					return false;
				}
				$('#from20190723').form('submit',{
					url:'./../device/saveOrUpdateDevice',
					onSubmit:function(param){
						param.detail = fDetail0616();
						return $(this).form('enableValidation').form('validate');
					},
					success:function(json){
						let data = eval('(' + json + ')');  // change the JSON string to javascript object
						let id = data.data.id;
						uploadImage20200602(id);
					}
				});
			}
		}

		//设备发布中的信息-逻辑删除
		function deleteDatagrid(ids){
			$.ajax({
				type: "POST",
				url: "./../device/deleteDevice",
				data: {ids:ids},
				success: function(json){
					if(json.code == 200){
						new jBox('Notice', {
							color: 'green',
							autoClose: 2500,
							content: '下架成功。',
							showCountdown: true,
							animation: 'slide'
						});
						reloadDatagrid();
					}else{
						new jBox('Notice', {
							color: 'red',
							autoClose: 2500,
							content: '下架失败！',
							showCountdown: true,
							animation: 'slide'
						});
					}
				}
			});
		}

		//文件表图片-逻辑删除
		function deleteImage20200602(ids){
			$.ajax({
				type: "POST",
				url: "./../device/deletePicture",
				data: {ids:ids},
				success: function(json){
					if(json.code == 200){
						new jBox('Notice', {
							color: 'green',
							autoClose: 2500,
							content: '图片删除成功。',
							showCountdown: true,
							animation: 'slide'
						});
						reloadDatagrid();
					}else{
						new jBox('Notice', {
							color: 'red',
							autoClose: 2500,
							content: '图片删除失败！',
							showCountdown: true,
							animation: 'slide'
						});
					}
				}
			});
		}

		//刷新datagrid
		function reloadDatagrid(){
			$('#dialog_20190723_addOrUpdateOrMenu').dialog('close');
			$('#menu_edit_20181029').datagrid('reload');
		}
	</script>
</body>
</html>